<template>
	<div style="float: right;display: flex;">
		<div>
			<el-button @click="check" class="redBtn" type="info">检查</el-button>
			<p style="font-size: 8px;">请先检查再完成</p>
		</div>
		<el-button @click="finishFn" class="greenBtn" type="info">完成</el-button>
		<span @click="back" style="cursor: pointer;line-height: 32px;">返回</span>
	</div>
	<div class="subBox">
		<h3 style="text-align: center;">{{props.classname}}课程表</h3>
		<el-table :data="lessonArr" style="width: 100%" border>
			<!-- <el-table-column prop="level" label="time" width="120"/> -->
			<el-table-column prop="level" label="" width="120" align="center"/>
			<el-table-column label="周一" align="center">
				<template #default='scope'>
					<el-select @change="selectTeaFn(scope.row.list[0])" v-model="scope.row.list[0].subId" placeholder="科目">
						<el-option v-for="item in courseslist" :key="item.subId" :label="item.subName"
							:value="item.subId">
						</el-option>
					</el-select>
					<el-select  placeholder="老师" v-model="scope.row.list[0].teaId">
						<el-option v-for="item in scope.row.list[0].teacherlist" :key="item.teaId" :label="item.teaName"
							:value="item.teaId">
						</el-option>
					</el-select>

				</template>
			</el-table-column>
		  <el-table-column prop="name" label="周二"  align="center" >
				<template #default='scope'>
					<el-select @change="selectTeaFn(scope.row.list[1])" v-model="scope.row.list[1].subId" placeholder="科目">
						<el-option v-for="item in courseslist" :key="item.subId" :label="item.subName"
							:value="item.subId">
						</el-option>
					</el-select>
					<el-select  placeholder="老师" v-model="scope.row.list[1].teaId">
						<el-option v-for="item in scope.row.list[1].teacherlist" :key="item.teaId" :label="item.teaName"
							:value="item.teaId">
						</el-option>
					</el-select>
				</template>
			</el-table-column> 
			<el-table-column prop="address" label="周三"  align="center">
				<template #default='scope'>
					<el-select @change="selectTeaFn(scope.row.list[2])" v-model="scope.row.list[2].subId" placeholder="科目">
						<el-option v-for="item in courseslist" :key="item.subId" :label="item.subName"
							:value="item.subId">
						</el-option>
					</el-select>
					<el-select  placeholder="老师" v-model="scope.row.list[2].teaId">
						<el-option v-for="item in scope.row.list[2].teacherlist" :key="item.teaId" :label="item.teaName"
							:value="item.teaId">
						</el-option>
					</el-select>
				</template>
			</el-table-column>
		   <el-table-column prop="address" label="周四" align="center" >
				<template #default='scope'>
					<el-select @change="selectTeaFn(scope.row.list[3])" v-model="scope.row.list[3].subId" placeholder="科目">
						<el-option v-for="item in courseslist" :key="item.subId" :label="item.subName"
							:value="item.subId">
						</el-option>
					</el-select>
					<el-select  placeholder="老师" v-model="scope.row.list[3].teaId">
						<el-option v-for="item in scope.row.list[3].teacherlist" :key="item.teaId" :label="item.teaName"
							:value="item.teaId">
						</el-option>
					</el-select>
				</template>
			</el-table-column>
			<el-table-column prop="address" label="周五" align="center" >
				<template #default='scope'>
					<el-select @change="selectTeaFn(scope.row.list[4])" v-model="scope.row.list[4].subId" placeholder="科目">
						<el-option v-for="item in courseslist" :key="item.subId" :label="item.subName"
							:value="item.subId">
						</el-option>
					</el-select>
					<el-select  placeholder="老师" v-model="scope.row.list[4].teaId">
						<el-option v-for="item in scope.row.list[4].teacherlist" :key="item.teaId" :label="item.teaName"
							:value="item.teaId">
						</el-option>
					</el-select>
				</template>
			</el-table-column>
			<el-table-column prop="address" label="周六" align="center" >
				<template #default='scope'>
					<el-select @change="selectTeaFn(scope.row.list[5])" v-model="scope.row.list[5].subId" placeholder="科目">
						<el-option v-for="item in courseslist" :key="item.subId" :label="item.subName"
							:value="item.subId">
						</el-option>
					</el-select>
					<el-select  placeholder="老师" v-model="scope.row.list[5].teaId">
						<el-option v-for="item in scope.row.list[5].teacherlist" :key="item.teaId" :label="item.teaName"
							:value="item.teaId">
						</el-option>
					</el-select>
				</template>
			</el-table-column>
		   <el-table-column prop="address" label="周日" align="center" >
				<template #default='scope'>
					<el-select @change="selectTeaFn(scope.row.list[6])" v-model="scope.row.list[6].subId" placeholder="科目">
						<el-option v-for="item in courseslist" :key="item.subId" :label="item.subName"
							:value="item.subId">
						</el-option>
					</el-select>
					<el-select  placeholder="老师" v-model="scope.row.list[6].teaId">
						<el-option v-for="item in scope.row.list[6].teacherlist" :key="item.teaId" :label="item.teaName"
							:value="item.teaId">
						</el-option>
					</el-select>
				</template>
			</el-table-column>
		</el-table>
	</div>
</template>

<script setup>
	import { defineEmits,ref,reactive,shallowRef, defineProps,onMounted} from 'vue';
	import {Search,CirclePlus} from '@element-plus/icons-vue'
	import {CheckupdateLesson,AddLesson,SubjectList,ClassLesson,GetTeacher,ClassSubjectList} from "../api/wym"
	import { ElMessage,ElMessageBox} from 'element-plus'
	
	const props = defineProps({
		changenum: Number,
		addclassid:Number,
		classname:String
	});
	// console.log(props.classname)
	
	let lessonArr=ref([{
					level: "第一节",
					list: [{
						subId: "",
						teaId: "",
						dayName: "周1",
						timeName: "第1节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周2",
						timeName: "第1节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周3",
						timeName: "第1节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周4",
						timeName: "第1节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周5",
						timeName: "第1节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周6",
						timeName: "第1节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周日",
						timeName: "第1节课",
						myErrorData: [],
						teacherlist: [],
					},
					]
				},
				{
					level: "第二节",
					list: [{
						subId: "",
						teaId: "",
						dayName: "周1",
						timeName: "第2节课",
						myErrorData: [],
						teacherlist: [],
	
					},
					{
						subId: "",
						teaId: "",
						dayName: "周2",
						timeName: "第2节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周3",
						timeName: "第2节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周4",
						timeName: "第2节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周5",
						timeName: "第2节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周6",
						timeName: "第2节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周日",
						timeName: "第2节课",
						myErrorData: [],
						teacherlist: [],
					},
					]
				},
				{
					level: "第三节",
					list: [{
						subId: "",
						teaId: "",
						dayName: "周1",
						timeName: "第3节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周2",
						timeName: "第3节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周3",
						timeName: "第3节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周4",
						timeName: "第3节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周5",
						timeName: "第3节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周6",
						timeName: "第3节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周日",
						timeName: "第3节课",
						myErrorData: [],
						teacherlist: [],
					}]
				},
				{
					level: "第四节",
					list: [{
						subId: "",
						teaId: "",
						dayName: "周1",
						timeName: "第4节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周2",
						timeName: "第4节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周3",
						timeName: "第4节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周4",
						timeName: "第4节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周5",
						timeName: "第4节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周6",
						timeName: "第4节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周日",
						timeName: "第4节课",
						myErrorData: [],
						teacherlist: [],
					},
	
					]
				},
				{
					level: "第五节",
					list: [{
						subId: "",
						teaId: "",
						dayName: "周1",
						timeName: "第5节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周2",
						timeName: "第5节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周3",
						timeName: "第5节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周4",
						timeName: "第5节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: "",
						teaId: "",
						dayName: "周5",
						timeName: "第5节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周6",
						timeName: "第5节课",
						myErrorData: [],
						teacherlist: [],
					},
					{
						subId: null,
						teaId: null,
						dayName: "周日",
						timeName: "第5节课",
						myErrorData: [],
						teacherlist: [],
					},
					]
				},
	])
	
	// 完成按钮
	let finishFlag=ref(false)
	
	// 班级科目查询
	let courseslist=ref([])
	const subjectList=async()=>{
		let res=await ClassSubjectList({
			clazzId:props.addclassid
		})
		// console.log("班级科目列表",res)
		courseslist.value=res.filter(v=>v.status==1)
	}

	
	// 根据科目选择老师
	let selectTeaList=ref([])
	const selectTeaFn=async(item)=>{
		finishFlag.value=false
		item.teacherlist=[]
		// console.log(item)
		// 根据课程选择老师
		let res=await GetTeacher({
			subId:item.subId
		})
		// console.log("老师",res)
		item.teacherlist=res.teachers
	}

	// 点击检查
	let schas = ref([])
	const check=async()=>{
		lessonArr.value.forEach(v=>{
			v.list.forEach(item => {
				item.clazzId = props.addclassid
				schas.value.push(item)
			})
		})
		// console.log("schas",schas.value)
		let res=await CheckupdateLesson({
			schas:schas.value
		})
		// console.log("课表检查",res)
		if(res.data.code==200){
			finishFlag.value=true
			ElMessage.success({
				message:"验证通过可以添加/修改"
			})
		}else{
			finishFlag.value=false
			ElMessage.error({
				message:"操作失败"
			})
		}
	}
	
	// 点击完成
	const finishFn=async()=>{
		// console.log("jiancha",schas.value)
		if(finishFlag.value==false){
			ElMessage.warning({
				message:"请先检查课表"
			})
		}else{
			// 添加课表
			let res=await AddLesson({
				schas:schas.value
			})
			// console.log("添加课表",res)
			if(res===undefined){
				emit('changeShow')
				ElMessage.success({
					message:"添加成功"
				})
			}else{
				ElMessage.error({
					message:"操作失败"
				})
			}
		}
	}
	
	
	// 点击返回
	const emit = defineEmits(['changeShow']);
	const back=()=>{
		emit('changeShow');
	}
	onMounted(()=>{
		subjectList()
	})
</script>

<style scoped lang="less">
	.redBtn{
		background-color: #ff0000;
		margin-right: 9px;
		border: none;
	}
	.greenBtn{
		background-color: #10b008;
		margin-right: 9px;
		border: none;
	}
	.el-table{
		margin-top: 10px;
		--el-table-header-text-color:#333 !important;
		--el-table-border-color:#d5d5d6
	}
	.subBox{
		background-color: #fff;
		margin-top: 70px;
		padding: 10px 20px;
		box-sizing: border-box;
		padding-bottom: 50px;
	}
</style>